<template>
  <div class="server">
    <el-container class="server">
      <el-aside width="200px">
        <!-- 侧边栏菜单区域 -->
        <el-menu :default-active="activeIndex" class="el-menu-vertical-demo" background-color="#373d41" text-color="#fff" active-text-color="#409EFF" router unique-opened>
          <!-- End！-->
          <el-menu-item index="/user" @click="saveActivePath('/user')">
            <template slot="title">
              <!-- 图标 -->
              <i class="el-icon-location"></i>
              <!-- 文本 -->
              <span>用户管理</span>
            </template>
          </el-menu-item>
          <!-- End! -->
          <el-menu-item index="/cheJian" @click="saveActivePath('/cheJian')">
            <template slot="title">
              <i class="el-icon-location"></i>
              <span>车间管理</span>
            </template>
          </el-menu-item>
          <!-- End! -->
          <el-menu-item index="/gongQu" @click="saveActivePath('/gongQu')">
            <template slot="title">
              <i class="el-icon-location"></i>
              <span>工区管理</span>
            </template>
          </el-menu-item>
          <el-menu-item index="/xianMing" @click="saveActivePath('/xianMing')">
            <template slot="title">
              <i class="el-icon-location"></i>
              <span>线名管理</span>
            </template>
          </el-menu-item>
          <el-menu-item index="/typeM" @click="saveActivePath('/typeM')">
            <template slot="title">
              <i class="el-icon-location"></i>
              <span>作业类型</span>
            </template>
          </el-menu-item>
          <!-- End！-->
          <el-menu-item index="/fuZeRen" @click="saveActivePath('/fuZeRen')">
            <template slot="title">
              <i class="el-icon-location"></i>
              <span>车间或工区负责人</span>
            </template>
          </el-menu-item>
          <!-- End！-->
          <el-menu-item index="/lianLuoYuan" @click="saveActivePath('/lianLuoYuan')">
            <template slot="title">
              <i class="el-icon-location"></i>
              <span>驻站联络员</span>
            </template>
          </el-menu-item>
          <!-- End！-->
          <el-menu-item index="/fangHuYuan" @click="saveActivePath('/fangHuYuan')">
            <template slot="title">
              <i class="el-icon-location"></i>
              <span>现场防护员</span>
            </template>
          </el-menu-item>

          <el-menu-item index="/updatePassword" @click="saveActivePath('/updatePassword')">
            <template slot="title">
              <i class="el-icon-location"></i>
              <span>修改密码</span>
            </template>
          </el-menu-item>
        </el-menu>
      </el-aside>
      <el-main>
        <router-view></router-view>
      </el-main>
    </el-container>
  </div>
</template>

<script>
export default {
name: "Server",
  data(){
  return{
    activeIndex : '/user'
  }
  },
  created() {
    const path =  window.sessionStorage.getItem("sPath");
    if(path!=null){
      this.activeIndex = path;
    }
  },
  methods:{
    saveActivePath(path){
      window.sessionStorage.setItem("sPath",path);
    }
  }

}
</script>

<style lang="less" scoped>
.el-menu.el-menu--horizontal{
  border-bottom: none;
}
.el-aside {
  background-color: #373d41;
  width: 100%;
  .el-menu {
    border-right: none;
    width: 100%;
  }
}

.el-main {
  background-color: #eaedf1;
  height: 100%;
  padding: 0;
}

.server {
  height: 100%;
}
</style>
